import { useDispatch, useSelector } from '@umijs/max';
import { useEffect } from 'react';
import {Tag} from "antd"
export default function TagContainer(props){
    // 传递typeID
    // 计算出目标Tag组件
    const color = props.color ;
    const id = props.typeId;
    const dispatch = useDispatch();
    const {typeList}= useSelector(state=>state.type)
    // 如果没有list 就进行请求
    useEffect(()=>{
        if(typeList.length===0){
          // 请求数据
          dispatch({
            type:'type/_initList'
          })
        }else{
          console.log("已经有数据了,不用请求了");
          return
        }
      },[])
      const tag = typeList.filter((item)=>{
          return item._id===id
      })
    const targetTag= color?( <Tag color={color}>{tag[0].typeName}</Tag>)
    :(<Tag>{tag[0]?.typeName}</Tag>)
    return (
       <>
        {tag.length>0?targetTag:null}
       </>
        )
}